<!DOCTYPE html>
<html>
    <head>
        {include file='public/meta'/}
        <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/bootstrap-datetimepicker.css"/>

        <style type="text/css">
            .red{
                color: #FF6667;
            }
            .green{
                color: #66CC99;
            }
            .persont{
                font-size: 12px;
            }
        </style>
    </head>
    <body>
    {include file='public/header'/}
    <section>
        <!------------------导航-------------------------->
        {include file='public/left'/}
        <!--------------------------主要内容区域------------------------------------->
        <div class="content">
            <div class="page-heading mgl15 mgr15">
                <ul class="breadcrumb">
                    <li>当前位置是&nbsp;:</li>
                    <li><a href="{:url('cardus/carduslist')}">会员卡管理</a></li>
                    <li class="active" style="color: #02b87f;"> 会员卡统计</li>
                </ul>
            </div>
            <div class="mgl15 mgr15">
                <div class="panel panel-default panel-search">
                    <div class="panel-heading">
                        <h5 class="panel-title"><span class="glyphicon glyphicon-search pull-left" style="margin-right: 10px;"></span>条件筛选</h5>
                    </div>
                    <div class="panel-body">
                        <form action="" method="get" class="form-horizontal table-search form-search" role="form">
                            <div class="col-sm-6 col-md-6 col-lg-4 ">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">门店：</label>
                                    <div class="col-sm-9">
                                        <select name="mid" class="form-control">
                                            {if condition="get_mid_num() neq '1'"}
                                            <option value="">所有门店</option>
                                            {/if}
                                            {volist name='mach' id='mid'}
                                            <option value="{$mid['id']}" {if condition="$p_data['mid'] eq $mid['id']"}selected{/if}>{$mid.merchant}</option>
                                            {/volist}
                                        </select>
                                    </div>
                                </div>
                            </div>

                        </form>
                    </div>
                    <div class="panel-footer">
                        <a href="javascript:;" class="btn btn-primary" onclick="searchform()">查找</a>
                        <a href="javascript:;" class="btn btn-default" onclick="clearform()">清空</a>
                    </div>
                </div>
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h5 class="panel-title">
                            核销分析

                        </h5>
                    </div>
                    <div class="panel-body">
                        <ul class="fenxilist clearfix">
                            <li class="col-sm-4">
                                <div>核销笔数(笔)</div>
                                <div></div>
                                <div>
                                    <span>日:</span>
                                    <span class="persontnum">{$daysum.numsum}/</span>
                                    <span>周:</span>
                                    <span class="persontnum">{$weeksum.numsum}/</span>
                                    <span>月:</span>
                                    <span class="persontnum">{$monthsum.numsum}/</span>
                                </div>
                            </li>
                            <li class="col-sm-4">
                                <div>核销金额(元)</div>
                                <div></div>
                                <div>
                                    <span>日:</span>
                                    <span class="persontnum">{$daysum.balsum}/</span>
                                    <span>周:</span>
                                    <span class="persontnum">{$weeksum.balsum}/</span>
                                    <span>月:</span>
                                    <span class="persontnum">{$monthsum.balsum}/</span>
                                </div>
                            </li>
                            <li class="col-sm-4">
                                <div>核销积分(元)</div>
                                <div></div>
                                <div>
                                    <span>日:</span>
                                    <span class="persontnum">{$daysum.bonsum}/</span>
                                    <span>周:</span>
                                    <span class="persontnum">{$weeksum.bonsum}/</span>
                                    <span>月:</span>
                                    <span class="persontnum">{$monthsum.bonsum}/</span>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="panel panel-default">
                    <div class="panel-heading" style="position:relative;">
                        <h5 class="panel-title">会员卡列表</h5>
                     
                    </div>
                    <div class="panel-body">
                        <table class="table table-bordered">
                            <thead>
                            <th>会员卡名称</th>
                            <th>积分状态</th>
                            <th>领取数量</th>
                            <th>库存</th>
                            <th>创建时间</th>
                            <th>操作</th>
                            </thead>
                            <tbody>
                            {volist name="list" id="vo"}
                            <tr>
                                <td><a href="{:url('cardus/cardinfo',['card_id'=>$vo['card_id']])}" class="btn-link">{$vo.title}</a></td>
                                <td>
                                    {eq name="vo.supply_bonus" value="1"}
                                        开启
                                    {else/}
                                        未开启
                                    {/eq}
                                </td>
                                <td><a href="{:url('cardus/getlist',['card_id'=>$vo.card_id])}" class="darkred">{:getcarduscon($vo['card_id'],0)}</a></td>
                                <td><a href="{:url('cards/editstock',['card_id'=>$vo.card_id,'type'=>'1'])}" class="darkred">{$vo.stocks}</a></td>
                                <td>{$vo.create_time}</td>
                                <td><a class="btn-link" href="{:url('report/reportcardmemberlist',['card_id'=>$vo.card_id])}" >核销明细</a></td>
                            </tr>
                            {/volist}
                            </tbody>

                        </table>
                    </div>
                </div>
            </div>
            {include file='public/footer'/}
        </div>
    </section>
</body>
<script src="__STATIC_URL__/static/js/commen.js" type="text/javascript" charset="utf-8"></script>
<script src="__STATIC_URL__/static/js/bootstrap-datetimepicker.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    $(function () {
        var myDate = new Date();
        $('#starttime').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: true,
            endDate: myDate.toLocaleDateString()
        }).on('changeDate', function (ev) {
            var starttime = $('#starttime').val();
            var endtime = $('#endtime').val();
            if (starttime != "" && endtime != "") {
                var startD = new Date(Date.parse(starttime.replace(/-/g, "/")));
                var endD = new Date(Date.parse(endtime.replace(/-/g, "/")));
                var days = parseInt((endD.getTime() - startD.getTime()) / (1000 * 60 * 60 * 24));
                if (days > 31) {
                    alert("日期范围应在一个月之内");
                    $('#starttime').val('');
                    return false;
                };
                if (endtime < starttime) {
                    $('#starttime').val('');
                    alert('开始时间必须大于结束时间');
                    return;
                };
                $("#endtime").datetimepicker('setStartDate',starttime);
                $("#starttime").datetimepicker('hide');
            }
        });
        $('#endtime').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: true,
            endDate: myDate.toLocaleDateString()
        }).on('changeDate', function (ev) {
            var starttime = $('#starttime').val();
            var endtime = $('#endtime').val();
            if (starttime != "" && endtime != "") {
                var startD = new Date(Date.parse(starttime.replace(/-/g, "/")));
                var endD = new Date(Date.parse(endtime.replace(/-/g, "/")));
                var days = parseInt((endD.getTime() - startD.getTime()) / (1000 * 60 * 60 * 24));
                if (days > 31) {
                    alert("日期范围应在一个月之内");
                    $('#endtime').val('');
                    return false;
                };
                if (endtime < starttime) {
                    $('#endtime').val('');
                    alert('开始时间必须大于结束时间');
                    return;
                };
                $("#starttime").datetimepicker('setEndDate',endtime);
                $("#endttime").datetimepicker('hide');
            }
        });
    });
</script>
<script type="text/javascript">
    $(".persontnum").each(function (i) {
        var val = $(this).text();
        var type = val[0];
        if (type == "-") {
            $(this).next(".glyphicon").addClass("glyphicon-arrow-down");
            $(this).next(".glyphicon").addClass("green");
        } else if (type == "+") {
            $(this).next(".glyphicon").addClass("glyphicon-arrow-up");
            $(this).next(".glyphicon").addClass("red");
        }
    })
</script>
</html>
